<template>
	
		<theme-box title="绑定微信账户">
			<form method="post" action="" class="form-horizontal" v-el:form @submit.prevent>
				<div class="box-body">
				  <div class="row">
				  	<div class="col-sm-6">				
							<form-input name="nickname" :required=true title="微信账号" left="4"></form-input>
							<form-input name="wxtoken" :required=true title="微信接入token" left="4"></form-input>
							<form-input name="url" :required=true title="微信接入url" left="4"></form-input>
							<form-group title="微信类型" left="4">
								<select name="wechatType" class="form-control">
										<option value="1">订阅号</option>
										<option value="2">服务号</option>
								</select>
							</form-group>					  		
				  	</div>
				  	<div class="col-sm-6">	
		  	      <app-list left="4"></app-list>
			  	    <form-input name="appsecret" :required=true title="微信app密钥" left="4"></form-input>		 	  
				  	  <form-input name="appid" :required=true title="公众号appid" left="4"></form-input>
							<form-group title="机构类型" left="4">
								<select name="brhNoFlag" class="form-control">
										<option v-for="mcht in mchtList" :value="mcht.mchtId">
											{{mcht.mchtName}}
										</option>
								</select>
							</form-group>
									 		
				  	</div>
				  </div>
																																												
				</div>
				<!-- /.box-body -->
				<div class="wizard-buttons">
					<div class="row">
						<div class="col-sm-11">
							<div class="text-center">
								<v-button theme="primary" type="submit" class="col-sm-offset-1 pull-left">确认</v-button>
								<v-button class="col-sm-offset-1 pull-right" @click=reset>重置</v-button>
							</div>
						</div>
					</div>
				</div>
				<!-- /.box-footer -->
			</form>

		</theme-box>

</template>

<style lang="css" scoped>
	.treeview input[type="checkbox"] {
		width: 12px;
		margin-right: 6px;
	}
	
	.treeview .list-group-item {
		padding: 10px 15px;
	}

</style>
<script>	
	//商户列表
	import List from 'pages/partial/midlist.vue';
		
	var serialize = require('form-serialize');

	export default {
		data: () => ({
			model: {
				child: []
			},
			mchtList: []
		}),
		components: {
			'app-list': List
		},			
		methods: {
			reset() {
				$("label.error").remove();
				this.$els.form.reset();
			},
			getMcht() {
				let self = this;
				self.$post({
					url: '/api/v1' + projectName_Url + '/list/brh/brhList.html'
				}).then(response => {

				},response => {
					if(response) {
						let mchtList = [];
						Object.keys(response).forEach(key => {								
								let json = {
									mchtId: key,
									mchtName: response[key]
								};			
								mchtList.push(json);
						});	
						self.$set("mchtList",mchtList);
					}
		
				});				
			},				
			submit(data) {
			    let self = this;
					self.$post({
						url: '/api/v1' + projectName_Url + '/wechat/mcht/add.html',
						data
					}).then(response => {
				
						Midway.alert("操作成功").then(function () {

								self.$els.form.reset();
								let data = {
									title: "操作提示",
									content: "是否进入账户管理查看?"
								}								
								Midway.confirm(data).then(function () {
										self.$route.router.go('/wechat/account/list');
								})
								
							})
						
					},error => {});				
			}
		},
		ready: function () {
			
			let self = this;
			
			self.getMcht();
			
			$(this.$els.form).submit(function () {
				return false;
			});

			$(this.$els.form).validate({
				submitHandler: function () {
					let form = this.currentForm;
					$(form).find("input").each(function () {
						$(this).val($.trim($(this).val()));
					});
					let _data = serialize(form, {
						hash: true
					});
					
				  self.submit(_data);

				},
				rules: {
					nickname: {
						required: true
					},
					appsecret: {
						required: true
					},
					mchtIdFlag: {
						required: true
					},
					appid: {
						required: true
					},
					url: {
						required: true
					},
					wxtoken: {
						required: true
					}
				},
				messages: {
					nickname: {
						required: "昵称为必填项" 
					},
					appsecret: {
						required: "app密钥为必填项"
					},
					mchtIdFlag: {
						required: "商户编号为必填项"
					},
					appid: {
						required: "公众号appid为必填项"
					},
					url: {
						required: "微信接入url为必填项"
					},
					wxtoken: {
						required: "微信接入token为必填项"
					}					
				}
			});
		}
	}
</script>